<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>

		<style type="text/css">
			.box{
				width: 100px;
				height: 100px;
				background: #000000;
				color: #AAAAAA;
				
				/* margin-right: 20px; */
			}
			
	
		
			.lf {
				float: left;
			}
			
		/* 	.c{
				color: red;
				background: #00FFFF;
				height: 100px;
				width: 265px;
				border:.2px  solid  #0000FF;
			} */
			
			
			
			.text{
				width: 50px;
				height: 50px;
				border:.2px  solid  #0000FF;
			}
			
		</style>
	</head>
	<body>
		<!-- 
		 A浮动后， B,C 会进行 补位的。  为看的更加清晰 ，把B 变得更大
		 -->
		<div class="box lf  ">A</div>
		<div class="box lf ">B</div>
		<div class="box ">CCCCCCCCCCCCCCCCCC</div>
	
		
		<!-- <div class="text">AAAAAAaaa</div> -->
		
	</body>
</html>
